<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        //微任务  和  宏任务
        //promise 是一个同步方法,promise对象里的then是异步方法
        console.log(111);
        setTimeout(() => {
            console.log(555);
        });
        let p = new Promise(res => {
            console.log(222);
            res();
        })

        setTimeout(() => {
            console.log(444);
        });
        p.then(res => {
            console.log(666);
        })


        console.log(333);
        // 1 2 3 6 5 4

        /* 
        js 任务   分 同步 和 异步
        异步任务: 1.宏任务  2.微任务
        微任务: 解决js的精度问题,减少js的颗粒度
        宏任务: [1] [2] [3] [4] [5]  依次排队
        如果 任务精度高: 微任务 {1} {2} {3} {4} {5}

        宏任务: 定时器  主代码块(script: 用于执行同步代码)  ajax 资源的加载.....
        微任务: promise对象的then   MutationObserver :用于观察节点变化  
                process.nextTick()

        先执行宏任务,每一个宏任务后边会跟随一个微任务队列
        【... [...]】【...[...]】【...[]】 

        【script：同步代码[检测宏任务后的微任务队列 then]】 【setTimeout[空]】 。。。。
        【1,2,3[then 4]】 【settimeout：5 [空]】
        */
    </script>
</body>

</html>